<template>
  <div>
    <input type="checkbox" value="科幻" name="" id="" v-model="hobby">科幻
    <input type="checkbox" value="喜剧" name="" id="" v-model="hobby">喜剧
    <input type="checkbox" value="动漫" name="" id="" v-model="hobby">动漫
    <input type="checkbox" value="冒险" name="" id="" v-model="hobby">冒险
    <input type="checkbox" value="科技" name="" id="" v-model="hobby">科技
    <input type="checkbox" value="军事" name="" id="" v-model="hobby">军事
    <input type="checkbox" value="娱乐" name="" id="" v-model="hobby">娱乐
    <input type="checkbox" value="奇闻" name="" id="" v-model="hobby">奇闻
    <ul>
      <li v-for="(item,index) in hobby" :key="index">
        {{item}}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data () {
    return {
      hobby: []
    }
  }
}
</script>

<style>

</style>
